body {
    font-family: Arial, sans-serif; /* 设置默认字体为Arial，无则使用sans-serif */
    margin: 0; /* 移除默认外边距 */
    padding: 0; /* 移除默认内边距 */
    background-color: #f5f5f5; /* 设置背景颜色 */
}

.product-container {
    display: flex; /* 使用flex布局 */
    justify-content: space-between; /* 设置子项两端对齐 */
    padding: 20px; /* 设置内边距 */
    background-color: white; /* 设置背景颜色 */
    border-radius: 8px; /* 设置圆角 */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 设置阴影效果 */
}

.product-images {
    position: relative; /* 设置相对定位 */
    width: 40%; /* 设置宽度为40% */
}

.main-image {
    width: 100%; /* 设置宽度为100% */
    border-radius: 8px; /* 设置圆角 */
}

.thumbnails {
    display: flex; /* 使用flex布局 */
    justify-content: space-between; /* 设置子项两端对齐 */
    margin-top: 10px; /* 设置上边距 */
}

.thumbnails img {
    width: 30%; /* 设置宽度为30% */
    cursor: pointer; /* 设置鼠标指针样式 */
    border: 2px solid transparent; /* 设置边框为2px透明 */
    border-radius: 4px; /* 设置圆角 */
}

.thumbnails img.active {
    border-color: #ff6700; /* 设置活动项的边框颜色 */
}

.product-info {
    width: 55%; /* 设置宽度为55% */
    padding: 20px; /* 设置内边距 */
}

.product-info h1 {
    font-size: 24px; /* 设置字体大小 */
    margin-bottom: 10px; /* 设置下边距 */
}

.price {
    font-size: 20px; /* 设置字体大小 */
    color: #ff6700; /* 设置颜色 */
    margin-bottom: 10px; /* 设置下边距 */
}

.description {
    font-size: 14px; /* 设置字体大小 */
    color: #666; /* 设置颜色 */
    margin-bottom: 20px; /* 设置下边距 */
}

.location, .version-selection, .color-selection, .service-selection, .warranty-service {
    margin-bottom: 20px; /* 设置下边距 */
}

label {
    display: block; /* 设置为块级元素 */
    margin-bottom: 5px; /* 设置下边距 */
    font-weight: bold; /* 设置字体为粗体 */
}

input[type="text"], select {
    width: 100%; /* 设置宽度为100% */
    padding: 8px; /* 设置内边距 */
    border: 1px solid #ddd; /* 设置边框 */
    border-radius: 4px; /* 设置圆角 */
    box-sizing: border-box; /* 设置盒模型 */
}

a {
    color: #ff6700; /* 设置链接颜色 */
    text-decoration: none; /* 移除下划线 */
}

input[type="checkbox"] {
    margin-right: 5px; /* 设置右边距 */
}

body {
    font-family: Arial, sans-serif; /* 设置默认字体为Arial，无则使用sans-serif */
    margin: 0; /* 移除默认外边距 */
    padding: 0; /* 移除默认内边距 */
    background-color: #f5f5f5; /* 设置背景颜色 */
    display: flex; /* 使用flex布局 */
    flex-direction: column; /* 设置主轴方向为列 */
    align-items: center; /* 设置子项居中对齐 */
    padding: 20px; /* 设置内边距 */
}

.action-buttons {
    display: flex; /* 使用flex布局 */
    gap: 10px; /* 设置子项间距 */
    margin-bottom: 20px; /* 设置下边距 */
}

button {
    padding: 10px 20px; /* 设置内边距 */
    border: none; /* 移除边框 */
    border-radius: 4px; /* 设置圆角 */
    font-size: 16px; /* 设置字体大小 */
    cursor: pointer; /* 设置鼠标指针样式 */
}

.add-to-cart {
    background-color: #ff6700; /* 设置背景颜色 */
    color: white; /* 设置文本颜色 */
}

.add-to-cart:hover {
    background-color: #e65c00; /* 设置鼠标悬停时的背景颜色 */
}

.like-button {
    background-color: #999; /* 设置背景颜色 */
    color: white; /* 设置文本颜色 */
}

.like-button:hover {
    background-color: #666; /* 设置鼠标悬停时的背景颜色 */
}

.service-info {
    display: flex; /* 使用flex布局 */
    flex-wrap: wrap; /* 设置换行 */
    gap: 10px; /* 设置子项间距 */
    justify-content: center; /* 设置子项居中对齐 */
}

.service-item {
    background-color: #fff; /* 设置背景颜色 */
    border: 1px solid #ddd; /* 设置边框 */
    border-radius: 4px; /* 设置圆角 */
    padding: 5px 10px; /* 设置内边距 */
    display: flex; /* 使用flex布局 */
    align-items: center; /* 设置子项居中对齐 */
}

.icon {
    width: 16px; /* 设置宽度 */
    height: 16px; /* 设置高度 */
    background-color: #ccc; /* 设置背景颜色 */
    border-radius: 50%; /* 设置圆角 */
    margin-right: 5px; /* 设置右边距 */
}